<template>
  <view>
    <component ref="current" :is="currentView" :columns="columns" :item="item" :buttonList="buttonList"
               @next="next" @moreClick="moreClick"></component>
  </view>
</template>

<script>
import { markRaw } from 'vue'
import FormBoListStylize1 from "../stylize/FormBoListStylize1";
import FormBoListStylize2 from "../stylize/FormBoListStylize2";

export default {
  name: "FormBoListStylize",
  props: {
    stylize: {
      type: Number
    },
    columns: {
      type: Array,
      default() {
        return []
      }
    },
    item: {
      type: Object,
      default() {
        return {}
      }
    },
    index: {
      type: Number,
      default: 0
    },
    buttonList: {
      type: Array,
      default() {
        return []
      }
    }
  },
  data() {
    return {
      currentView: ''
    }
  },
  created() {
    if (this.stylize == '1') {
      this.currentView = markRaw(FormBoListStylize1)
    } else if (this.stylize == '2') {
      this.currentView = markRaw(FormBoListStylize2)
    }
  },
  methods: {
    next(item) {
      this.$emit("next", item);
    },
    moreClick(item) {
      this.$emit("moreClick", item);
    }
  }
}
</script>

<style scoped>

</style>
